*{margin: 0; padding: 0;}
li{list-style: none;}
.PxToRem(@name,@px){
    @{name} : @px / 75 * 1rem;
}
.name(){
     display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-around;
    justify-content: space-around;
    width:100%;
   
}
.p-bottom (@age3){
    .PxToRem(padding-bottom,@age3);
}
.p-top(@age2){
    .PxToRem(padding-top,@age2);
}
header{
     background:#27c1b4;
    .PxToRem(height,98);
     display: flex;
     align-items: center;
    p{
      .PxToRem(font-size,31);
               color: #fff;
               margin: 0 auto;
        
    }
}

.topTr{
     .PxToRem(height,180);
     .PxToRem(font-size,23);
              display: flex;
              justify-content: space-around;
              border-bottom: 1px solid #f0f0f0;
              align-items: center;
              text-align: center;
             ul{
        
        .name();
        .p-top(34);
        li{
            text-align: center;
            a{
                color: #959595;
            }
            img{
                .PxToRem(width,68);
                .PxToRem(height,70);
            }
            p{
                .p-top(20);
                .p-bottom(14);
            }
        }
    }
              
}
.bottomTr{
     .PxToRem(height,180);
     .PxToRem(font-size,23);
              display: flex;
              justify-content: space-around;
              align-items: center;
              text-align: center;
             ul{
        
        .name();
        .p-top(34);
        li{
            text-align: center;
            a{
                color: #959595;
            }
            img{
                .PxToRem(width,68);
                .PxToRem(height,70);
            }
            p{
                .p-top(20);
                .p-bottom(14);
            }
        }
    }
    
}
.section{background: #f0f0f0; height: 18px;}

       
.nav{border-bottom: 1px solid #f0f0f0;
    .PxToRem(height,76);
    .PxToRem(margin-bottom,30);
    align-items: center;
    display: flex;
    justify-content: space-around;
    p{
       .PxToRem(font-size,23); 
    }
}


.main{ 
        .PxToRem(margin-bottom,50);
    dl{ border-bottom: 1px solid #f0f0f0;
        padding:2%;
        .PxToRem(height,203);
        dt{
            display:block; text-align: right;
            img{
                .PxToRem(width,194);
                .PxToRem(height,146);
            }
        }
        dd{
            h6{
                .PxToRem(font-size,26);
                font-weight: bold;
                margin-bottom: 3%;
            }
            p{   margin-bottom: 3%;
                .span{display: inline-block; margin-right: 4%;}
            }
        }
        
          display: flex; justify-content: space-between;
    }
}



footer{
    width: 100%;
    position: fixed;
    bottom: 0;
    background: #fff;
    border-top:1px solid #ccc;
    .PxToRem(height,98);
    display: flex;
    justify-content: space-around;
    align-items: center;
    text-align: center;
    dl{
        flex: 1;
        dt{
            img{
                .PxToRem(width,46);
                .PxToRem(height,45);
            }
        }
        dd{.PxToRem(margin-top,6);
            
        }
    }
}










